/*
* @Autor: Mr Lu
* @Version: 1.0
* @Date: 2019-12-03
* @LastEditors: OBKoro1
* @LastEditTime: 2019-12-03
* @Description:  RandomMeasureLedgerList
*/
<template>
  <div id="RandomMeasureLedgerList" class="p-box">
    <div class="p-return">
      <mu-appbar color="primary" class="lan-header">
        <mu-button icon slot="left" @click="backNow">
          <i class="iconfont angle-left iconangle-left"></i>
          <span class="lan-header-back">返回</span>
        </mu-button>
        台账列表
      </mu-appbar>
    </div>
    <mu-container ref="container" class="lan-loadmore-content">
      <mu-load-more @refresh="refresh" :refreshing="refreshing" :loading="loading" @load="load" :loaded-all="loadAll">
        <!-- 这里是业务结构 -->
        <mu-paper class="lan-card" :z-depth="1" v-for="(item,index) in listData" :key="index" @click="goDetail(item)">

          <div class="lan-detail">
            <span class="lan-detail-h">项目名称：</span>
            <span class="lan-detail-r">{{item.projectName}}</span>
          </div>
          <div class="lan-detail">
            <span class="lan-detail-h">实测区域：</span>
            <span class="lan-detail-r">{{item.areaName}}</span>
          </div>
          <div class="lan-detail">
            <span class="lan-detail-h">实测点位数：</span>
            <span class="lan-detail-r">{{item.pointNum}}</span>
          </div>
        </mu-paper>
        <p v-if="loadAll && listData.length > 5" class="nodataTips">无更多数据了</p>
      </mu-load-more>
      <NoData v-if="listData.length <= 0 && loaded"/>
    </mu-container>
    <!-- 详情 -->
    <MeasureDetail :detail="detail" :open="detailDialog" @open="openDetailDialog"
                   @close="closeDetailDialog"></MeasureDetail>
    <SelectArea v-if="area.open" :open="area.open" v-model="area.checked" :currentProject="area.currentProject" @change="areaChange" @close="closeAreaDialog" @confirm="areaConfirm"></SelectArea>
    <Org ref="org" v-if="orgDialog" v-model="org" orgType="currOrgProject" @change="orgChange"
         :open="orgDialog" @open="openOrgDialog" @close="closeOrgDialog" @confirm="orgConfirm"
    ></Org>
  </div>
</template>

<script>
  import Org from "@/select/org/Org.vue"
  import SelectArea from "@/select/area/Area.vue"
  import MeasureDetail from "@/realMeasureModule/MeasureDetail.vue"

  export default {
    name: "RandomMeasureLedgerList",
    components: {
      SelectArea,
      Org,
      MeasureDetail
    },
    data() {
      return {
        api: {
          getRandomMeasureListsApi: '/safety/measure/measureList',
          getRandomMeasureDetailApi: '/safety/measureTask/detail'
        },
        // 组织弹窗状态
        orgDialog: false,
        // 组织
        org: [],
        refreshing: false,
        loading: false,
        loaded: false,
        loadAll: false,
        pageSize: 10,
        pageNo: 0,
        totalPage: 1,
        listData: [],
        detailDialog: false,
        detail: {},
        searchcontroll: false,
        form: {
          projectId: '',
          areaId: '',
          deptId: '',
          type:''
        },
        typeList: [
          {value: '1', name: '质量周例会'},
          {value: '2', name: '质量专项检查会'},
          {value: '3', name: '其他'},
        ],
        projectList: [],
        currentOrg: {},
        // 区域选择相关
        area: {
          currentProject: {},
          // 区域选择弹窗状态
          open: false,
          // 选择结果
          checked: {}
        }
      };
    },
    computed: {},
    async created() {
      let aa = JSON.parse(sessionStorage.getItem('areaInfoData') || null)
      if(aa){
        this.form = aa
        this.currentOrg = JSON.parse(sessionStorage.getItem('orgInfoData') || null)
        this.org = [this.currentOrg]
        this.form.projectId = this.currentOrg.value
        this.form.type = this.currentOrg.type
        this.getData(this.form)
      }else{
        let orgInfo = this.$A.GS("orgInfo");
        this.currentOrg.type = orgInfo.type
        this.currentOrg.value = orgInfo.orgId
        this.currentOrg.label = orgInfo.label
        this.org = [this.currentOrg]
        if (this.currentOrg.type == '1') {
          this.orgDialog = false;
          this.form.projectId = this.currentOrg.value
          this.form.type = this.currentOrg.type
          this.orgConfirm()
        }else{
          this.orgDialog = true
        }
      }
      this.projectList = await this.$A.comData('projectList')
    },
    mounted() {
    },
    watch: {},
    methods: {
      skipPage(item) {
        this.$router.push({
          name: item.path
        });
      },
      // 组织选择
      orgChange() {
        // alert(this.org[0].label)
        console.log(this.org[0])
        this.form.projectId = this.org[0].value
        this.form.type = this.org[0].type
      },
      // 区域选择
      areaChange() {
        this.form.areaId = this.area.checked.id
      },
      // 打开组织选择弹窗
      openOrgDialog() {
        this.orgDialog = true
      },
      // 关闭组织选择弹窗
      closeOrgDialog() {
        this.orgDialog = false
        this.$router.back()
      },
      // 组织选择结果确认
      orgConfirm() {
        this.area.currentProject = this.org[0]
        this.orgDialog = false
        this.openAreaDialog()
      },
      // 打开区域选择
      openAreaDialog() {
        this.area.open = true
      },
      backNow(){
        sessionStorage.removeItem('areaInfoData')
        sessionStorage.removeItem('orgInfoData')
        this.area.open = true
      },
      // 关闭区域选择
      closeAreaDialog() {
        this.area.open = false
        // this.$router.back()
        // this.openOrgDialog()
        let orgInfo = this.$A.GS("orgInfo");
        if (orgInfo.type == '1') {
          this.$router.back()
        } else {
          this.orgDialog = true
        }
      },
      // 区域选择结果确认
      areaConfirm() {
        this.area.open = false
        this.getData(this.form)
      },
      // 打开详情弹窗
      openDetailDialog() {
        this.detailDialog = true
      },
      // 关闭详情弹窗
      closeDetailDialog() {
        this.detailDialog = false
      },
      async refresh() {
        this.refreshing = true;
        this.pageNo = 0;
        this.totalPage = 1;
        this.loaded = false
        this.loadAll = false
        this.listData = []
        this.$refs.container.scrollTop = 0;
        await this.getData(this.form)
        this.refreshing = false;
      },
      search() {
        this.loaded = false
        this.loadAll = false
        this.pageSize = 10
        this.pageNo = 0
        this.totalPage = 1;
        this.listData = []
        this.searchcontroll = false
        this.getData(this.form)
      },
      clearSearch() {
        this.form = {
          projectId: '',
          startMeetTime: '',
          endMeetTime: '',
          meetType: '',
          meetName: '',
        }
      },
      async getData(params) {
        if (this.pageNo >= this.totalPage) {
          this.loadAll = true;
          return;
        }
        this.$openLoading()
        if (!this.loadAll) {
          this.pageNo += 1;
        } else {
          return
        }

        let obj = {
          "obj": {
            // "projectId": projectId,
            // "type":this.$A.GS('orgInfo')['type'],
          },
          "pageNo": this.pageNo,
          "pageSize": this.pageSize,
        };
        if (params) {
          Object.assign(obj.obj, params);
        }
        this.$A.Go('post', this.api.getRandomMeasureListsApi, obj)
          .then(success => {
            this.$closeLoading()
            if (success.code == 200) {
              let data = success.body.rows || []
              let total = success.body.page.rows || '0'
              this.totalPage = Math.ceil(total / this.pageSize)
              // let data =  []
              // let total = 0
              if (this.pageNo == 1) {
                this.listData = data;
              } else {
                this.listData.push(...data);
              }
              if (total == 0 || Math.ceil(total / this.pageSize) <= this.pageNo || data.length <= 0) {
                this.loadAll = true;
              }
            } else {
              this.listData = [];
            }
            this.loaded = true;
          }).catch((err) => {
            this.$closeLoading()
            console.warn(err)
          })
      },
      async load() {
        this.loading = true;
        await this.getData(this.form)
        this.loading = false;
      },
      // 获取随机测量详情
      /*getDetailData(list) {
        this.$openLoading()
        this.$A
          .Go("get", this.api.getRandomMeasureDetailApi, {
            id: list.id})
          .then(response => {
            this.$closeLoading()
            Util.processRes(response, () => {
              console.log(response)
              this.detail = list;
              this.openDetailDialog()
            });
            Util.processError(this, response);
          })
          .catch(err => {
            this.$closeLoading()
            console.log(err);
          });
      },*/
      goDetail(list) {
        sessionStorage.setItem('areaInfoData',JSON.stringify(this.form))
        sessionStorage.setItem('orgInfoData',JSON.stringify(this.currentOrg))
        this.$router.push({
          name: 'RandomMeasureDetail',
          query: {
            id: list.id
          }
        })
      },

    },
    destroyed() {
    }
  };
</script>

<style lang="scss">
  #RandomMeasureLedgerList {
  }

  .detail-dialog-body {
    height: calc(100% - 0.45rem);
    overflow: auto;
  }
</style>
